<template>
  <view>
    <!--时间选择    弹出框-->
    <template name="dateChooseModel">
      <view v-if="'true'" class="template-date-view">
        <view class="template-dv-header">滚轮编辑</view>
        <view class="template-date">
          <view
            class="template-begindate"
            @click="onChooseDateListener"
            data-tag="begin"
          >
            <view class="template-begin-date">{{ beginDate }}</view>
            <view
              :class="
                isBegin
                  ? ' template-begin-time-view-choose'
                  : 'template-begin-time-view'
              "
            >
              <view class="template-begin-time">{{ beginTime }}</view>
              <view class="template-begin-time-type">
                <view>{{ begin_monorafter }}</view>
              </view>
            </view>
          </view>
          <view class="template-center">
            <image class="template-date-center" :src="beginToEnd"></image>
          </view>
          <view
            class="template-begindate"
            @click="onChooseDateListener"
            data-tag="end"
          >
            <view class="template-begin-date">{{ endDate }}</view>
            <view
              :class="
                !isBegin
                  ? ' template-begin-time-view-choose'
                  : 'template-begin-time-view'
              "
            >
              <view class="template-begin-time">{{ endTime }}</view>
              <view class="template-begin-time-type">{{ end_monorafter }}</view>
            </view>
          </view>
        </view>

        <view class="template-picker-content">
          <picker-view
            class="template-picker-view"
            indicator-style="height: 80rpx; backgourd=#4d4d4d"
            style="width: 100%; height: 240rpx"
            :value="picker_value"
            @change="pickerChange"
          >
            <picker-view-column
              :class="isChooseYearMonth ? ' template-show' : 'template-hidden'"
            >
              <view
                class="template-picker-year"
                style="line-height: 80rpx; height: 80rpx"
                v-for="(item, index) in picker_year"
                :key="index"
                >{{ item }}年</view
              >
            </picker-view-column>
            <picker-view-column
              :class="isChooseYearMonth ? 'template-show' : 'template-hidden'"
            >
              <view
                class="template-picker-month"
                style="line-height: 80rpx; height: 80rpx"
                v-for="(item, index) in picker_month"
                :key="index"
                >{{ item }}月</view
              >
            </picker-view-column>
            <picker-view-column
              :class="isChooseYearMonth ? ' template-show' : 'template-hidden'"
            >
              <view
                class="template-picker-day"
                style="line-height: 80rpx; height: 80rpx"
                v-for="(item, index) in picker_day"
                :key="index"
                >{{ item }}日</view
              >
            </picker-view-column>
            <picker-view-column
              :class="isChooseYearMonth ? ' template-show' : 'template-33'"
            >
              <view
                class="template-picker-hours"
                style="line-height: 80rpx; height: 80rpx"
                v-for="(item, index) in picker_hours"
                :key="index"
                >{{ item }}</view
              >
            </picker-view-column>
            <picker-view-column
              :class="isChooseYearMonth ? ' template-show' : 'template-33'"
            >
              <view
                class="template-picker-minutes"
                style="line-height: 80rpx; height: 80rpx"
                v-for="(item, index) in picker_minutes"
                :key="index"
                >{{ item }}</view
              >
            </picker-view-column>
            <picker-view-column
              :class="isChooseYearMonth ? ' template-show' : 'template-33'"
            >
              <view
                class="template-picker-minutes"
                style="line-height: 80rpx; height: 80rpx"
                v-for="(item, index) in picker_monorafter"
                :key="index"
                >{{ item }}</view
              >
            </picker-view-column>
          </picker-view>
        </view>

        <view class="template-allday-view">
          <view class="template-allday-text">年月</view>
          <switch
            type="switch"
            @change="isYearMonthListener"
            :checked="isChooseYearMonth"
            class="template-allday-switch"
          >
          </switch>
        </view>
        <view class="template-picker-bottom">
          <view class="template-bottom-buttom">
            <view class="template-bottom-today" @click="dateFormReset"
              >取消</view
            >
            <view class="template-bottom-ok" @click="dateFormSubmit">确定</view>
          </view>
        </view>
      </view>
    </template>

    <template name="remindChooseModel">
      <view class="template-R-view" @click="onRCancelListener">
        <view class="template-remind" @click.stop.prevent="onRCancelListener1">
          <view
            class="template-remind-list"
            v-for="(item, parentIdx) in lists"
            :key="parentIdx"
          >
            <view
              class="template-remind-item"
              @click.stop.prevent="onRemindChooseListener"
              :data-pIdx="parentIdx"
              :data-cIdx="childIdx"
              v-for="(item, childIdx) in item"
              :key="childIdx"
            >
              <image
                class="remind-image"
                :src="
                  item.isChoose
                    ? remind_images.ic_choose
                    : remind_images.ic_nochoose
                "
              ></image>

              <view class="remind-text">{{ item.remindValue }}</view>
            </view>
          </view>
          <view class="template-buttom">
            <view class="buttom-cancel" @click="onRCancelListener">取消</view>
            <view class="buttom-sumbit" @click="onRSubmintlListener">确定</view>
          </view>
        </view>
      </view>
    </template>

    <!--生日弹出框  -->
    <block name="birthdayView">
      <view class="template-B-view" @click="onRCancelListener">
        <view
          class="template-B-birthday"
          @click.stop.prevent="onRCancelListener1"
        >
          <view class="template-birthday-top">
            <view class="template-B-top-birthdayview">
              <image
                class="template-B-top-birthdayimg"
                src="/static/todo/images/pic_birthday.png"
              ></image>
            </view>
            <view class="template-B-top-cancelview">
              <image
                class="template-B-top-cancelimg"
                src="/static/todo/images/ic_close.png"
                @click="onRCancelListener"
              >
              </image>
            </view>
          </view>
          <view class="template-birthday-center">
            <view class="template-B-center-person"
              >{{ scheduleType }}的生日</view
            >
            <view class="template-B-center-age">{{ constellation }}座</view>
            <view class="template-B-center-birthday">{{
              birthdayDateString
            }}</view>
          </view>
          <view class="template-birthday-bottom">
            <view
              class="template-B-bottom-left"
              :data-id="scheduleId"
              @click="onEditBirthdayListener"
            >
              <image
                class="template-B-bottom-img"
                src="/static/todo/images/ic_edit_birthday.png"
              ></image>
            </view>
            <view
              class="template-B-bottom-right"
              :data-index="index"
              :data-id="scheduleId"
              @click="onDeletBirthdayListener"
            >
              <image
                class="template-B-bottom-img"
                src="/static/todo/images/ic_delete_birthday.png"
              ></image>
            </view>
          </view>
        </view>
      </view>
    </block>

    <!--缺省页  -->
    <block name="defaultView">
      <view class="template-N-view">
        <image
          class="template-N-img"
          src="/static/todo/images/pic_default.png"
        ></image>
      </view>
    </block>
  </view>
</template>

<script>
// todo/template/template.js
var utils = require('@/static/todo/utils.js')

var app = getApp()
export default {
  data() {
    return {
      show: false,
      picker_value: {},
      picker_year: {},
      picker_month: {},
      picker_day: {},
      picker_hours: {},
      picker_minutes: {},
      lists: {},

      remind_images: {
        ic_choose: '',
        ic_nochoose: '',
      },

      beginDate: '',
      isBegin: false,
      beginTime: '',
      begin_monorafter: '',
      beginToEnd: '',
      endDate: '',
      endTime: '',
      end_monorafter: '',
      isChooseYearMonth: false,
      picker_monorafter: [],
      parentIdx: 0,
      childIdx: 0,
      scheduleType: '',
      constellation: '',
      birthdayDateString: '',
      scheduleId: '',
    }
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getRemindData()
    const date = new Date()
    const cur_year = date.getFullYear()
    const cur_month = date.getMonth() + 1
    var picker_year = utils.getYear()
    var picker_month = utils.getMonth()
    var picker_day = utils.getDays(cur_year, cur_month)
    var picker_hours = utils.getHours()
    var picker_minutes = utils.getMinutes()
    var picker_value = utils.getTodayDate(
      picker_year,
      picker_month,
      picker_day,
      picker_hours,
      picker_minutes
    )
    console.log(picker_value)
    console.log(picker_year)
    console.log(picker_month)
    console.log(picker_day)
    console.log(picker_hours)
    console.log(picker_minutes)
    this.setData({
      picker_value: picker_value,
      picker_year,
      picker_month,
      picker_day,
      picker_hours,
      picker_minutes,
      show: true,
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},
  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},
  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},
  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {},
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {},
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {},
  methods: {
    getRemindData() {
      var lists = []
      var item1 = [
        {
          remindId: 10,
          remindValue: '不提醒',
          remindPosition: 0,
          isChoose: false,
          remindtime: null,
        },
      ]
      var item2 = [
        {
          remindId: 11,
          remindValue: '当天（10:00）',
          remindPosition: 1,
          isChoose: false,
          remindtime: null,
        },
        {
          remindId: 12,
          remindValue: '提前1天（10:00）',
          remindPosition: 1,
          isChoose: false,
          remindtime: null,
        },
      ]
      var item3 = [
        {
          remindId: 13,
          remindValue: '提前2天（10:00）',
          remindPosition: 2,
          isChoose: false,
          remindtime: null,
        },
        {
          remindId: 14,
          remindValue: '提前3天（10:00）',
          remindPosition: 2,
          isChoose: false,
          remindtime: null,
        },
        {
          remindId: 15,
          remindValue: '提前1周（10:00）',
          remindPosition: 2,
          isChoose: false,
          remindtime: null,
        },
      ]
      lists.push(item1)
      lists.push(item2)
      lists.push(item3)
      this.setData({
        lists,
        remind_images: {
          ic_choose: '/static/todo/images/ic_choose.png',
          ic_nochoose: '/static/todo/images/ic_nochoose.png',
        },
      }) // wx.showLoading({
      //   title: '加载中...',
      //   mask: "true",
      // })
      // var that = this;
      // var url = 'https://appinter.sunwoda.com/schedule/getAllUser.json';
      // var method = 'POST';
      // var header = {
      //   'content-type': 'application/x-www-form-urlencoded'
      // };
      // var data = {
      //   userNo: userNo
      // }
      // app.func.getNetWork(url, method, header, data, function (res) {
      //   if (res) {
      //     if (res.data.statusCode == 0) {
      //       wx.hideLoading();
      //       items = res.data.dataInfo.listData;
      //       if (items.length == 0) {
      //         wx.showToast({
      //           title: "数据为空",
      //           icon: "loading",
      //           duration: 500,
      //           mask: "true",
      //         })
      //       } else {
      //         var sharePersons = [];
      //         for (var i = 0; i < items.length; i++) {
      //           var personChoose = false;
      //           sharePersons.push(personChoose);
      //         }
      //         that.setData({
      //           items: items,
      //           showShareStatus: true,
      //           // scheduleId,
      //           sharePersons,
      //         })
      //       }
      //     }
      //     else {
      //       wx.hideLoading();
      //       wx.showModal({
      //         title: '提示',
      //         content: res.data.message,
      //         showCancel: false,
      //         success: function (res1)
      //         { },
      //       });
      //     }
      //   } else {
      //     wx.hideLoading();
      //     wx.showModal({
      //       title: '提示',
      //       content: '网络不稳定，请稍后再试',
      //       showCancel: false,
      //       success: function (res) {
      //       }
      //     })
      //   }
    },

    /**
     * 提醒时间选择监听
     */
    onRemindListener(e) {
      console.log(e)
      var lists = this.lists

      if (
        e.currentTarget.dataset.pidx == 0 &&
        e.currentTarget.dataset.cidx == 0
      ) {
        for (var i = 0; i < lists.length; i++) {
          for (var j = 0; j < lists[i].length; j++) {
            if (i == 0 && j == 0) {
              lists[i][j].isChoose = !lists[i][j].isChoose
            } else {
              lists[i][j].isChoose = false
            }
          }
        }
      } else {
        lists[0][0].isChoose = false
        lists[e.currentTarget.dataset.pidx][
          e.currentTarget.dataset.cidx
        ].isChoose =
          !lists[e.currentTarget.dataset.pidx][e.currentTarget.dataset.cidx]
            .isChoose
      }

      this.setData({
        lists: lists,
      })
    },

    onChooseDateListener() {
      console.log('占位：函数 onChooseDateListener 未声明')
    },

    pickerChange() {
      console.log('占位：函数 pickerChange 未声明')
    },

    isYearMonthListener() {
      console.log('占位：函数 isYearMonthListener 未声明')
    },

    dateFormReset() {
      console.log('占位：函数 dateFormReset 未声明')
    },

    dateFormSubmit() {
      console.log('占位：函数 dateFormSubmit 未声明')
    },

    onRCancelListener() {
      console.log('占位：函数 onRCancelListener 未声明')
    },

    onRCancelListener1() {
      console.log('占位：函数 onRCancelListener1 未声明')
    },

    onRemindChooseListener() {
      console.log('占位：函数 onRemindChooseListener 未声明')
    },

    onRSubmintlListener() {
      console.log('占位：函数 onRSubmintlListener 未声明')
    },

    onEditBirthdayListener() {
      console.log('占位：函数 onEditBirthdayListener 未声明')
    },

    onDeletBirthdayListener() {
      console.log('占位：函数 onDeletBirthdayListener 未声明')
    },
  },
}
</script>
<style>
@import './template-view.css';
</style>
